<aside class="main-sidebar">
    <section class="sidebar">
        <div class="user-panel text-center">
          <div class="pull image">
            <img src="assets/img/user.jpg" class="img-circle" alt="User Image">
          </div>
        </div>
      <ul class="sidebar-menu">
        <hr/>

        <li class="treeview" *ngFor="let menu of menuList;let q=index" (click)="colorOne(q)">
          <!-- 有二级菜单  添加+号 并修改点击样式 -->
          <a *ngIf="menu.subMenuList"   [href]="menu.subMenuList ? '#' : ' '">
            <img src="assets/icon/{{menu.menuIcon}}" alt="{{menu.menuName}}">
            <span>{{menu.menuName}}</span>
            <span class="pull-right-container" *ngIf="menu.subMenuList">
              <i class="glyphicon glyphicon-plus"></i>
              <!--<i class="glyphicon glyphicon-minus"></i>-->
            </span>
          </a>

          <!-- 没有二级菜单   -->
          <a *ngIf="!menu.subMenuList"  routerLink="{{menu.menuUrl}}" >
            <img src="assets/icon/{{menu.menuIcon}}" alt="{{menu.menuName}}"> <span [ngStyle]="{'color':q==numberOne?'white':''}">{{menu.menuName}}</span>
          </a>

          <!-- 循环遍历二级菜单  -->
          <ul class="treeview-menu" *ngIf="menu.subMenuList" >
            <li *ngFor="let menus of menu.subMenuList;let i = index;">
              <a routerLink="{{menus.menuUrl}}" (click)="$event.stopPropagation();colorTwo(i)" [ngClass]="{'active':i==numberTwo}">
                <img src="assets/icon/{{menus.menuIcon}}" alt="{{menus.menuName}}">{{menus.menuName}}</a>
            </li>
          </ul>
          <hr/>
        </li>
      </ul>
      <div class="switchMenu">
        <a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
          <span style="color: transparent;">点击</span>
        </a>
      </div>
    </section>
  </aside>
